import 'package:ez_ic_led/commont/bg_bar_view.dart';
import 'package:flutter/material.dart';
import 'package:flutter_kit_plus/flutter_kit.dart';

import '../commont/slider_item.dart';
import '../tool/assets.dart';

class ColorView extends StatefulWidget {
  Function(List<int>) onChangedColor;
  Function(double) onChangedBright;
  Function(double) onChangedSpeed;
  List<int> color_select_list = [];
  double brightValue = 1;
  double speedValue = 1;
  ColorView(
      {super.key,
      required this.color_select_list,
      required this.brightValue,
      required this.speedValue,
      required this.onChangedColor,
      required this.onChangedBright,
      required this.onChangedSpeed});

  @override
  State<ColorView> createState() => _ColorViewState();
}

class _ColorViewState extends State<ColorView> {
  late final CircularColorPicker _coloCircular;
  late final _colorListView;
  @override
  void initState() {
    super.initState();

    ///色盘呢
    _coloCircular = CircularColorPicker(
      cirulaImage: assets.color,
      pointImage: assets.color_point,
      padding: const EdgeInsets.only(left: 0, right: 0),
      onChange: (p0) {
        // if (widget.color_select_list.isNotEmpty && p0[0] != 0 && p0[1] != 0 && p0[2] != 0) {
        if (p0[0] != 0 && p0[1] != 0 && p0[2] != 0) {
          _colorListView.color = p0.decimal;
          widget.onChangedColor(p0);
        }
      },
    );

    ///色列表
    _colorListView = ColorListView(
        leftIsAdd: false,
        currentShowIndex: 0,
        onChange: (p0, _) {
          var value = p0;
          value = (0xFF << 24) | (value & 0x00FFFFFF);
          _coloCircular.kstate.setInitialColor(Color(value));
          widget.onChangedColor(p0.bytes);
        });
    _colorListView.leftIcon = assets.arror_left;
    _colorListView.rightIcon = assets.arror_right;
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        Flexible(
            flex: 4,
            child: Row(
              // mainAxisAlignment: MainAxisAlignment.center,
              children: [
                Flexible(
                    flex: 2,
                    child: Padding(
                      padding: const EdgeInsets.only(top: 40, bottom: 10),
                      child: SliderItem(
                        name: 'Bright',
                        min: 1,
                        max: 100,
                        value: widget.brightValue,
                        onChange: (p0) => widget.onChangedBright(p0),
                      ),
                    )),
                Flexible(flex: 10, child: _coloCircular),
                Flexible(
                    flex: 2,
                    child: Padding(
                      padding: const EdgeInsets.only(top: 40, bottom: 10),
                      child: SliderItem(
                        name: 'Speed',
                        min: 1,
                        max: 100,
                        value: widget.speedValue,
                        onChange: (p0) => widget.onChangedSpeed(p0),
                      ),
                    ))
              ],
            )),
        const SizedBox(height: 10),
        Flexible(
            flex: 1,
            child: BgBarView(
                barTag: assets.Color_btn,
                child: Container(
                    padding: const EdgeInsets.only(left: 10, right: 10, top: 10, bottom: 10), child: _colorListView))),
      ],
    );
  }
}
